<template>
    <el-dialog
        :title="title"
        width="838px"
        :visible.sync="visible"
        :close-on-click-modal="false"
        append-to-body
        top="10px"
    >
        <div v-html="content" id="ofd" style="height: 485px; overflow: auto"></div>
    </el-dialog>
</template>
<script>
import { parseOfdDocument, renderOfd } from 'ofd.js'
export default {
    data() {
        return {
            visible: false,
            title: '',
            content: ''
        }
    },
    methods: {
        showDialog(data) {
            this.visible = true
            this.title = data.title
            if (data.type === 'txt') {
                let word = data.content.replace(/\n|\r\n/g, '<br/>')
                this.content = word
            } else if (data.type === 'ofd') {
                parseOfdDocument({
                    ofd: data.content,
                    success(res) {
                        const divs = renderOfd(res[0])
                        let contentDiv = document.getElementById('ofd')
                        contentDiv.innerHTML = ''
                        for (const div of divs) {
                            contentDiv.appendChild(div)
                        }
                    }
                })
            }
        }
    }
}
</script>
<style></style>
